<template>
  <div class="load-more">
    <pull-to :bottom-load-method="loadMore">
      <ul>
        <li
          v-for="(item,index) in dataList"
          :key="index"
        >{{item}}</li>
      </ul>
    </pull-to>
  </div>
</template>

<script>
import PullTo from 'vue-pull-to'
export default {
  components: {
    PullTo
  },
  data() {
    return {
      dataList: [1, 2, 3, 4, 5, 6, 6, 7]
    }
  },
  methods: {
    loadMore(loaded) {
      setTimeout(() => {
        for (let i = 0; i < 10; i++) {
          this.dataList.push(new Date().getTime() + i)
        }
        loaded('done')
      }, 1000)
    }
  }
}
</script>

<style scoped>
.load-more {
  height: 100vh;
}
</style>
